/**
 * Created by yoyoyk on 2017/3/20.
 */
import React , {Component}from 'react';
import { Modal, Button } from 'antd';
import InputBox from '../../common/InputBox.js'
import  Confirm from '../../common/Confirm.js'
import UpdateManagerPasswordMutation from "./mutation/UpdateManagerPasswordMutation"
import Relay from "react-relay";
import "./css/manager.css";

import {_message} from 'ANT_DE';
const message = _message;

export default class UpdatePwdModal extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            visible: false,
            __pwd1:'',
            __pwd2:'',
            __pwd3:'',
        }
        this.Style={};

        this.i=0;
        this.j=0;
        this.k=0;
        this.clear = this.clear.bind(this);
    }
    componentWillMount() {
        this.Style.addstaffview={
            textAlign:"center",
            display:"block",
            border:"3px solid green"
        }
        this.Style.addstaffview.border = "3px solid red";
        this.Style.addstaffview.width = 400;
        this.Style.addstaffview.height = 200;
        this.Style.addstaffview.fontSize = 30;
        this.Style.headerview={
            width:"634px",
            height:"44px",
            paddingLeft:"18px",
            lineHeight:"44px",
            display:"block",
            background:"#ccc",
            marginBottom:49
        }
    }

    state = { visible: false }
    showModal = () => {
        this.setState({
            visible: true,
        });
    }
    handleOk = (e) => {
        this.setState({
            visible: false,
        });
    }

    handleCancel = (e) => {
        this.setState({
            visible: false,
        });
    }


    bluron(type){
        switch (type){
            case 'pwd1':
                let aa = this.refs._pwd1.state.text;
                let re_pwd1 = /^[0-9a-zA-Z]{6,32}$/;
                if(re_pwd1.test(aa)){
                    this.setState({
                        __pwd1:"",
                    });
                }else if(aa===''){
                    this.setState({
                        __pwd1:""
                    });
                }else {
                    this.setState({
                        __pwd1:"当前密码输入有误"
                    });
                }
                break;

            case 'pwd2':
                let bb = this.refs._pwd2.state.text;
                let re_pwd2 = /^[0-9a-zA-Z]{6,32}$/
                if(re_pwd2.test(bb)){
                    this.setState({
                        __pwd2:"",
                    });
                }else if(bb===''){
                    this.setState({
                        __pwd2:""
                    });
                }else {
                    this.setState({
                        __pwd2:"当前密码输入有误"
                    });
                }
                return;

            case 'pwd3':
                let cc = this.refs._pwd3.state.text;
                let dd = this.refs._pwd2.state.text;
                if(cc===dd){
                    this.setState({
                        __pwd3:""
                    });
                }else if(cc===""){
                    this.setState({
                        __pwd3:""
                    });
                }else{
                    this.setState({
                        __pwd3:"两次密码输入不一致"
                    });
                }
                return;
        }
    }

    modify(){
        let bb = this.refs._pwd2.state.text;
        let re_pwd2 = /^[0-9a-zA-Z]{6,32}$/
        if(re_pwd2.test(bb)){
            this.j=1
        }else {
            this.j=0
        }
        let cc = this.refs._pwd3.state.text;
        let dd = this.refs._pwd2.state.text;
        if(cc===dd){
            this.k=1
        }else{
            this.k=0
        }
        if( this.j === 0 || this.k === 0 ){
            message.warning("请检查当前内容");
            return;
        }
        //格式确认无误发送数据
        Relay.Store.commitUpdate(
            new UpdateManagerPasswordMutation({
                managerId:this.props.managerId,
                password:this.refs._pwd1.state.text,
                newPassword:this.refs._pwd2.state.text,
            }),
            {
                onFailure: () => {

                },
                onSuccess: (response) => {
                    const data = response.updateManagerPassword.data;
                    if(data.errorCode === "0"){
                        message.success("编辑成功");
                        this.setState({
                            visible: false,
                        });
                    } else{
                        message.error(data.value);
                    }
                }
            }
        );
    }


    clear(){
        this.refs._pwd1.setState({
            text:""
        });
        this.refs._pwd2.setState({
            text:""
        });
        this.refs._pwd3.setState({
            text:""
        })

        this.setState({
            __pwd1:'',
            __pwd2:'',
            __pwd3:'',
        })
    }
    render(){
        return (
            <Modal visible={this.state.visible}
                   onOk={this.handleOk}
                   onCancel={this.handleCancel}
                   style={{width:"680",height:"565px",display:"block"}}
                   title={"修改密码"}
                   footer={false}
            >
                <div>
                    <InputBox titletext="当前密码" maxlength={32} type={"password"} className={"myCenter_info--input"} space="20px" style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd1'} bluron={this.bluron.bind(this,'pwd1')}/>
                    <p className="mycenter_newPas--alarm">{this.state.__pwd1}</p>
                </div>
                <div>
                    <InputBox titletext="新密码" maxlength={32} type={"password"}  className={"myCenter_info--input"} space="20px" style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd2'} bluron={this.bluron.bind(this,'pwd2')}/>
                    <p className="mycenter_newPas--alarm">{this.state.__pwd2}</p>
                </div>
                <div>
                    <InputBox titletext="确认新密码" maxlength={32} type={"password"}  className={"myCenter_info--input"}  space="20px" style={{width:312,height:30,borderColor:"#efefef",paddingLeft:10,color:"#999",paddingRight:64,marginTop:"10px"}} ref={'_pwd3'} bluron={this.bluron.bind(this,'pwd3')}/>
                    <p className="mycenter_newPas--alarm">{this.state.__pwd3}</p>
                </div>

                <Confirm tcontext="确认修改" style={{width:135,height:34,display:"inline-block",color:"#fff",fontSize:"16px",marginTop:'20',marginBottom:'20px',marginLeft:100,backgroundColor: '#36b3b3'}} touch={this.modify.bind(this)}/>
                <Confirm tcontext="取消" style={{width:135,height:34,display:"inline-block",color:"#666",fontSize:"16px",border: '1px solid #ccc',marginTop:20,marginBottom:'20px',marginLeft:38,backgroundColor: '#f7f5f5'}} touch={this.handleCancel.bind(this)}/>
            </Modal>
        )
    }
}
